$("#province").on("change",function () {
    var city = $("#province").val();
    $("#area").html("");
    var html = " <option value=''>全部</option>";
    $("#area").append(html);
    getCity(city);
})
$("#city").on("change",function () {
    var city = $("#city").val();
    getArea(city);
})
function getCity(city){
    $.ajax({
        url: '/management/city',
        data: {city: city},
        type: 'POST',
        dataType: 'json',//返回的数据类型
        success: function (data) {
            var cityArray =  data.cityArray;
            $("#city").html("");
            var html = " <option value=''>全部</option>";
            $.each(cityArray, function (i, item) {
                html += "<option value='"+item.district_id+"'>" + item.district + "</option>";
            });
            $("#city").append(html);
        }
    })
}

function getArea(area){
    $.ajax({
        url: '/management/area',
        data: {area: area},
        type: 'POST',
        dataType: 'json',//返回的数据类型
        success: function (data) {
            var cityArray =  data.cityArray;
            $("#area").html("");
            var html = " <option value=''>全部</option>";
            $.each(cityArray, function (i, item) {
                html += "<option value='"+item.district_id+"'>" + item.district + "</option>";
            });
            $("#area").append(html);
        }
    })
}
$(document).ready(function(){
    ajaxList();
});
$(".search").click(function () {
    var data = $("#searchform").serialize();
    ajaxList(data);
});

function ajaxList(data) {
    $.ajax({
        url: '/management/conditionEcharts',
        data: data,
        type: 'POST',
        dataType: 'json',//返回的数据类型
        success: function (data) {
            columnPie(data.totalArray.dog_adopt_experience,data.totalNum.dog_adopt_experience,data.totalName.dog_adopt_experience,'main1','#ed7d31');
            columnPie(data.totalArray.dog_adopt_environment,data.totalNum.dog_adopt_environment,data.totalName.dog_adopt_environment,'main2','#ffc000');
            columnPie(data.totalArray.dog_adopt_sterilization,data.totalNum.dog_adopt_sterilization,data.totalName.dog_adopt_sterilization,'main3','#70ad47');
            columnPie(data.totalArray.dog_adpot_workers,data.totalNum.dog_adpot_workers,data.totalName.dog_adpot_workers,'main4','#ff9999');
            columnPie(data.totalArray.dog_adpot_protocol,data.totalNum.dog_adpot_protocol,data.totalName.dog_adpot_protocol,'main5','#4472c4');
            columnPie(data.totalArray.dog_adpot_certificate,data.totalNum.dog_adpot_certificate,data.totalName.dog_adpot_certificate,'main6','#9999ff');
        }
    })
}
function columnPie(dataX,dataY,name,id,color) {
    var myChart = echarts.init(document.getElementById(id));
    option = {
        title: {
            text:name,
            x:'center'
        },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'shadow'
            }
        },

        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'value',
            boundaryGap: [0, 0.01]
        },
        yAxis: {
            type: 'category',
            data: dataX
        },
        series: [
            {
                type: 'bar',
                data: dataY,
                itemStyle:{
                    normal:{
                        color:color
                    }
                },
                label: {
                    normal: {
                        show: true,
                        position: 'right',
                        formatter:"{c}%"
                    }
                }
            }
        ]
    };
    myChart.setOption(option);
}

